<script>
export default {
  name: "TestComponent"
}
</script>

<template>
  <div class="test-container">
    <h1>测试页面</h1>
    <div class="button-group">
      <!-- 使用router-link实现导航 -->
      <router-link to="/login" class="nav-button">
        <button>前往登录页</button>
      </router-link>

      <router-link to="/register" class="nav-button">
        <button>前往注册页</button>
      </router-link>

      <router-link to="/ai-assistant" class="nav-button">
        <button>前往AI助手</button>
      </router-link>

      <router-link to="/flaw_FileWeb1" class="nav-button">
        <button>前往文件上传漏洞</button>
      </router-link>

      <router-link to="/flaw_SqlWeb1" class="nav-button">
        <button>前往SQL1漏洞</button>
      </router-link>

    </div>
  </div>
</template>

<style scoped>
.test-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  background-color: #f5f7fa;
}

h1 {
  margin-bottom: 2rem;
  color: #2c3e50;
}

.button-group {
  display: flex;
  gap: 1.5rem;
}

.nav-button button {
  padding: 12px 24px;
  background-color: #3498db;
  color: white;
  border: none;
  border-radius: 4px;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color 0.3s;
}

.nav-button button:hover {
  background-color: #2980b9;
}

/* 可选：移除router-link默认样式 */
a {
  text-decoration: none;
  color: inherit;
}
</style>